<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>login</title>
    <link href="css/login.css" rel="stylesheet">
    <script src="./js/jquery.min.js"></script>
    <script src="./js/jquery.cookie.js"></script>
</head>
<!--jQuery cookie 类库-->
<script type="text/javascript">

    //1.页面加载完成执行函数 获取cookie 填充表单
    window.onload =function () {

        //获取到cookie
        var cookies  = document.cookie.split(";");
        var uname = "userName=";
        var upass = "password=";
        for(var  i = 0;i<cookies.length;++i)
        {
            //区分用户名和密码的cookie userName password
            var ck = cookies[i].trim()

            //判断是哪个cookie
            if(ck.indexOf(uname)==0)
            {

                document.getElementById("username").value= ck.substring(uname.length,ck.length)

            }else  if(ck.indexOf(upass)==0)
            {
                document.getElementById("password").value= ck.substring(upass.length,ck.length)

            }


        }


    }

</script>

<body>
<div id="loginDiv">
    <form action="/servlet-loginDemo/LoginServlet" id="form">
        <h1 id="loginMsg">LOGIN IN</h1>
        <p>Username:<input id="username" name="username" type="text" ></p>

        <p>Password:<input id="password" name="password" type="password"></p>

        <p>记住密码:<input id="remem" name="remem" type="checkbox" value="1"></p>

        <div id="subDiv">
            <input type="submit" class="button" value="login up">
            <input type="reset" class="button" value="reset">&nbsp;&nbsp;&nbsp;
            <a href="register.html">没有账号？点击注册</a>
        </div>
    </form>
</div>
</body>
</html>
<!--1.前端获取后台传递数据? html

    使用异步请求=> Ajax -> jQuery
    使用会话 ->动态页面技术 JSP PHP ASP html + 变成语言+web
    本质 ：Servlet 9大内置对象 session  request Application
  -->